@import (reference) "less-nameset";
/* ---------- combobox ---------- */
.wi-combobox {
    display: inline-block;
    background-color: @textinput-bg;
    position: relative;
    vertical-align: middle;
}
.wi-combobox > input[type='text'] {
    border: @combobox-border;
    border-right: none;
    box-shadow: none;
    @xx: @combobox-arrow-w - @combobox-border-size;
    width: calc(~"100% - @{xx}");
}
.wi-combobox > .fa-chevron-down {
    border: @combobox-border;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    .btn-bg();
    color: @btn-font-color;
    width: @combobox-arrow-w;
    font-size:@font-size;
}
.wi-combobox > .fa-chevron-down:hover{
    .btn-hover-bg();
    color: @btn-hover-font-color;
}
.wi-combobox > .fa-chevron-down:before{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 0 - floor(@font-size / 2);
    margin-left: 0 - floor(@font-size / 2);
}
.wi-combobox-menu {
    overflow-y: auto;
    overflow-x: hidden;
    min-width: 120px;
    white-space: nowrap
}
.wi-combobox-menu > ul {
    position: absolute;
    min-width: 100%
}
li.wi-combobox-selected { background: @sel-bg; color: @sel-color; }
li.wi-combobox-option:not(.wi-combobox-selected):hover { background: @hover-bg; color: @hover-color; }